<!DOCTYPE html>

<html lang="en" class="x-admin-sm" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <title>添加用户</title>
    <header th:replace="header::html"></header>

</head>
<body>
<div class="x-body">
    <form class="layui-form">

        <div class="layui-form-item">
            <label for="L_uaccount" class="layui-form-label">
                <span class="x-red">*</span>账号
            </label>
            <div class="layui-input-inline">
                <input type="text" id="L_uaccount"  name="uaccount" lay-verify="uaccount"
                       autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>将会成为您唯一的账号,账号限制6-12个数字
            </div>
        </div>
        <div class="layui-form-item">
            <label for="L_pass" class="layui-form-label">
                <span class="x-red">*</span>密码
            </label>
            <div class="layui-input-inline">
                <input type="password" id="L_pass"  name="upassword" lay-verify="pass"
                       autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                长度在6-16之间，只能包含字符、数字和下划线
            </div>
        </div>


        <div class="layui-form-item">
            <label for="L_uname" class="layui-form-label">
                <span class="x-red">*</span>用户名
            </label>
            <div class="layui-input-inline">
                <input type="text" id="L_uname"  name="uname" required="" lay-verify="uname"
                       autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                昵称必须3到12位
            </div>
        </div>


        <div class="layui-form-item">
            <label for="L_telephone" class="layui-form-label">
                <span class="x-red">*</span>手机
            </label>
            <div class="layui-input-inline">
                <input type="text" id="L_telephone"  name="uphone" required=""
                       lay-verify="telephone" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                11位数字,纯数字
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label">性别</label>
            <div class="layui-input-block">
                <input type="radio" name="usex" value="男" title="男" checked="true">
                <input type="radio" name="usex" value="女" title="女">
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label">地址</label>
            <div class="layui-input-block">
                <input type="text" name="uaddress" lay-verify="uaddress" autocomplete="off" placeholder="请输入地址" class="layui-input" style="width: 70%">
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label"><span class="x-red">*</span>角色</label>
            <div class="layui-unselect layui-form-radio layui-form-radioed">
                <input type="radio" name="rid" value="3" title="雇主" >
                <input type="radio" name="rid" value="2" title="服务商">
            </div>
        </div>


        <div class="layui-inline">
            <label class="layui-form-label">请选择类型</label>
            <div class="layui-input-inline">
                <!--            一级-->

                <select name="sid" id="ntype" lay-filter="typeAAA">
                </select>

            </div>

        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">
            </label>
            <button class="layui-btn" lay-filter="add" lay-submit="">
                增加
            </button>
        </div>
    </form>
</div>
<script>
	layui.use(['form', 'layer', 'laydate'], function () {
		$ = layui.jquery;
		var form = layui.form
			, layer = layui.layer
			, laydate = layui.laydate;
		//日期
		laydate.render({
			elem: '#L_birthday'
			, format: 'yyyy-MM-dd' //可任意组合
		});

		//自定义验证规则
		form.verify({
			uname: [/^.{3,12}$/ , '昵称必须3到12位']
			,telephone: [/^1[3456789]\d{9}$/, '电话号码标准手机号必须为纯数字']
			,pass: [/^(\w){6,16}$/,'长度在6-16之间，只能包含字符、数字和下划线']
			,uaddress: [/^.{3,20}$/, '请输入正确的地址，限制3-20个字符']
			,uaccount: [/^\d{6,12}$/, '账号限制6-12个数字']
		});

		// 添加服务商类型
		$(function () {
			$.ajax({
				url: "/user/service",
				data: {},
				dataType: "json",
				success: function (results) {
					$("#ntype").empty();

					if (results != 0) {
						$("#ntype").append(new Option("---请选择---", ""));
						$.each(results, function (index, item) {
							$('#ntype').append(new Option(item.sname,item.sid));
						});
					} else {
						$("#ntype").append(new Option("暂无数据", ""));
					}
					layui.form.render("select");
				}
			})
			});


		$(function () {
			var rad=$("input[name='rid']:checked").val();

			if (rad == 3){
				$("#ntype").attr("disabled",true)
			}else if (rad == 2) {
				$("#ntype").attr("disabled",false)
			}


        });


		//监听提交
		form.on('submit(add)', function (data) {
			var rolelRadio = $("input[name=rid]:checked");
			if (rolelRadio === undefined || rolelRadio.length <= 0) {
				layer.alert("请给该用户设置角色");
				return false;
			}

			data.field.rid = rolelRadio.val();


			$.ajax({
				url: "/user/add",
				type: "POST",
				data: data.field,
				dataType: 'json',
				success: function (result) {
					if (result.code == 500 || result.code == 5000100 || result.code == 5000101) {
						layer.alert(result.msg);
					} else {
						layer.alert("注册成功", {icon: 6}, function () {
							//关闭当前frame
							xadmin.close();
							//实现页面跳转
							top.window.location.href = "/api-front/getPage?pageName=frontPage/user-login";


						});
					}
				}
			});
			return false;
		});


	});


</script>






</body>


